import { VxeFormItemProps, VxeGridPropTypes } from '@gui-pkg/antdcomponents';
import { h } from 'vue';
import { Tag } from 'ant-design-vue';

export const columns: VxeGridPropTypes.Columns = [
  {
    title: '测站名称',
    field: 'stnm',
    width: 160,
    align: 'center',
    fixed: 'left',
    treeNode: true,
  },
  {
    title: '时间',
    field: 'time',
    width: 160,
    align: 'center',
  },
  {
    title: '未来24小时累计降雨量(mm)',
    field: 'number',
    align: 'center',
  },
  {
    title: '日累计降雨量(mm)',
    field: 'number0',
    width: 140,
    align: 'center',
  },
  {
    title: 'I级预警阈值(mm)',
    field: 'number1',
    width: 140,
    align: 'center',
  },
  {
    title: 'Ⅱ级预警阈值(mm)',
    field: 'number2',
    width: 140,
    align: 'center',
  },
  {
    title: 'Ⅲ级预警阈值(mm)',
    field: 'number3',
    width: 140,
    align: 'center',
  },
  {
    title: '降雨等级',
    field: 'level',
    align: 'center',
  },
  {
    title: '预警等级',
    field: 'status',
    width: 90,
    align: 'center',
    slots: {
      default: ({ row }) => {
        const status = row.status;
        const enable = ~~status === 0;
        const color = enable ? 'green' : 'red';
        const text = enable ? '启用' : '一级';
        return h(Tag, { color: color }, () => text);
      },
    },
  },
  {
    title: '关联区域',
    field: 'aaa',
    align: 'center',
  },
  {
    title: '触发类型',
    field: 'bbb',
    align: 'center',
  },
  {
    width: 120,
    title: '操作',
    align: 'center',
    slots: { default: 'action' },
    fixed: 'right',
  },
];

export const searchFormSchema: VxeFormItemProps[] = [
  {
    field: 'menuName',
    title: '测站名称',
    itemRender: {
      name: 'AInput',
    },
    span: 6,
  },
  {
    field: 'status',
    title: '预警等级',
    itemRender: {
      name: 'ASelect',
      props: {
        options: [
          { label: 'I级', value: '1' },
          { label: 'Ⅱ级', value: '2' },
          { label: 'Ⅲ级', value: '3' },
          { label: 'IV级', value: '4' },
        ],
      },
    },
    span: 6,
  },
  {
    span: 12,
    align: 'right',
    className: '!pr-0',
    itemRender: {
      name: 'AButtonGroup',
      children: [
        {
          props: { type: 'primary', content: '查询', htmlType: 'submit' },
          attrs: { class: 'mr-2' },
        },
        { props: { type: 'default', htmlType: 'reset', content: '重置' } },
      ],
    },
  },
];
